<template>
  <div class="home">
    <!-- 轮播图 -->
    <van-swipe class="my-swipe" :autoplay="1000" indicator-color="white"  >
<<<<<<< HEAD
      <van-swipe-item  v-for="(item,index) in  list"  :key="index">
          <img  :src="item.banner_img">
      </van-swipe-item>
    </van-swipe>

  <!-- 导航 -->
    <ul  class="dh">
      <li @click="tsk">
        <img src="../../public/image/1.png" alt="">
        <p>特色课</p>
      </li>
      <li>
        <img src="../../public/image/2.png" alt="">
        <p>一对一辅导</p>
      </li>
      <li @click="xxrl">
        <img src="../../public/image/3.png" alt="">
        <p>学习日历</p>
      </li>
    </ul>

=======
  <van-swipe-item  v-for="(item,index) in  list"  :key="index">
    <img  :src="item.banner_img">
  </van-swipe-item>
</van-swipe>
 <!-- 导航 -->
  <ul  class="dh">
    <li   @click="tsk">
      <img src="../../public/image/1.png" alt="">
      <p>特色课</p>
    </li>
    <li  @click="ydy">
     <img src="../../public/image/2.png" alt="">
     <p>一对一辅导</p>
    </li>
    <li  @click="xxrl">
    <img src="../../public/image/3.png" alt="">
    <p>学习日历</p>
    </li>
  </ul>
>>>>>>> 31513d6cf6ff5291c5cd868b832651c2dad86690
  <Tearcher   :wx_list="item"  v-for="(item,index)  in wx_list" :key="index"></Tearcher>
  </div>
</template>

<script>

import { WxHomeList, WxBanner } from "../utils/http";
import Tearcher  from  '../components/Tearcher';
export default {
  name: "",
  components: {
    Tearcher,
  },
  props: [],
  data() {
    return {
      list:[],
     wx_list:[]
    };
  },
  mounted() {
     
    this.getlist(),
    WxHomeList().then(res=>{
    console.log(res)
    this.wx_list=res
  })
  },
  methods: {
    async getlist() {
      const res = await WxBanner();
      console.log(res);
      this.list=res
    },
    
    tsk(){
      this.$router.push("/course")
    },
    xxrl(){
      console.log(1)
      this.$router.push("/calendars")
    },
    ydy(){
      this.$router.push("./Coach")
    }
  },
  computed: {},
  watch: {},
  created() {},
};
</script>

<style scoped>
.home{
  width:100vw;
  background-color:whitesmoke;
}
.my-swipe{
  width: 100%;
  height: 200px;
}
.my-swipe img{
  width: 100%;
  height: 200px;
  justify-content: space-around;    
  align-items: center;
}
  /* <!-- 导航 --> */
.dh{
  display: flex;
  position: absolute;
  width: 100%;
  height: 100px;
  justify-content: space-around;
  top:167px;
}
.dh>li{
  width: 26%;
  background: #fff;
  border-radius: 5px;
  text-align: center;
}
.dh>li>img{
  width:25px;
  height:25px;
  margin-top: 25px;
}
.dh>li>p{
  margin-top: 5px;
  color:grey;
}

</style>
